<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Enoupps Business Oriented HTML Template</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />

  <!-- Bootstrap core CSS -->
<link href="js/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="js/jquery.gritter/css/jquery.gritter.css" />
  <link rel="stylesheet" href="fonts/font-awesome-4/css/font-awesome.min.css">
<!--For Menu-->
<link rel="stylesheet" type="text/css" href="js/jquery.nanoscroller/nanoscroller.css" />
<link rel="stylesheet" type="text/css" href="js/jasny.bootstrap/extend/css/jasny-bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="js/bootstrap-colorpicker/dist/css/bootstrap-colorpicker.min.css">
<link rel="stylesheet" type="text/css" href="js/bootstrap.switch/bootstrap-switch.min.css" />
<link rel="stylesheet" type="text/css" href="js/bootstrap.datetimepicker/css/bootstrap-datetimepicker.min.css" />
<link rel="stylesheet" type="text/css" href="js/jquery.select2/select2.css" />
<link rel="stylesheet" type="text/css" href="js/bootstrap.slider/css/slider.css" />
<link rel="stylesheet" type="text/css" href="js/jquery.icheck/skins/flat/green.css">
<link rel="stylesheet" type="text/css" href="js/bootstrap.daterangepicker/daterangepicker-bs3.css" />
  
<link href="css/style.css" rel="stylesheet" />  
<script type="text/javascript">
$(document).ready(function() {	
var scrollCount;
scrollCount = 1;
$('#mycarousel').jcarousel({
       easing: 'easeInOutQuint',
       animation: 600,
       scroll    : scrollCount
});
});
</script>
<script type="text/javascript" src="http://ip.qq.com/js/geo.js" charset="gb2312">
function promptinfo() 
{ 
var address = document.getElementById('address'); 
var s1 = document.getElementById('form-control1'); 
var s2 = document.getElementById('form-control2'); 
var s3 = document.getElementById('form-control3'); 
address.value = s1.value + s2.value + s3.value; 
} 

</script>
</head>
<body onload="setup();preselect('上海市');promptinfo();"> 
<!--Top menu-->
<div id="top">
  <div class="top-inner">
    <div id="logo"> <a href="#"><img src="images/logo.png" alt="" border="0" /></a> </div>
    <div id="primary-nav">
      <ul id="menu-primary-menu" class="sf-menu">
        <li><a href="index.html"><span>主页</span></a> </li>
        <li><a href="blog.html"><span>贴士</span></a></li>
        <li><a href="about.html"><span>目的地</span></a></li>
        <li><a href="blog.html"><span>景点</span></a></li>
        <li><a href="portfolio.html"><span>发布</span></a></li>
        <li><a href="pages-profile.html"><span>个人</span></a></li>
      </ul>
      <!-- END #primary-nav -->
    </div>
  </div>
</div>
<!--Title-->
<div class="title-outer">
  <div class="title"> 贴士<span>/ 发布贴士</span>
  </div>
</div>
<!--Middle section-->
<div class="block-flat">
          <div class="content">
              <form class="form-horizontal group-border-dashed" action="#" style="border-radius: 0px;">
                <div class="form-group">
                <label class="col-sm-3 control-label"></label>
                <div class="col-sm-6">
                  <label class="radio-inline"> <input class="icheck" type="radio" checked="" name="rad1"> 我是旅行者</label> 
                  <label class="radio-inline"> <input class="icheck" type="radio" name="rad1">我是本地人</label> 
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">请选择目的地</label>
                <div class="col-sm-6">
                  <select class="form-control1" name="province" id="s1">
                  </select>    
                   <select class="form-control2" name="province" id="s2">
                  </select>                 
                   <select class="form-control3" name="province" id="s3">
                  </select>                              
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">请选择景点类型标签</label>
                <div class="col-sm-6">
                  <select multiple class="form-control4">
                    <option>山川</option>
                    <option>购物</option>
                    <option>海洋</option>
                    <option>饮食</option>
                    <option>河流</option>
                    <option>现代</option>
                    <option>沙漠</option>
                    <option>岛屿</option>
                    <option>湖泊</option>
                    <option>草原</option>
                    <option>园林</option>
                    <option>宗教</option>
                    <option>故居</option>
                    <option>村落</option>
                    <option>建筑</option>
                    <option>民俗</option>
                  </select>                 
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">贴士内容</label>
                <div class="col-sm-6">
                  <textarea class="form-control5"></textarea>
                </div>
              </div>
              <div class="form-group">
                <label class="col-sm-3 control-label">上传照片</label>
                <div class="col-sm-6">
                  <div class="fileinput fileinput-new" data-provides="fileinput">
                    <div class="fileinput-new thumbnail" style="width: 200px; height: 150px;">
                      <img src="http://placehold.it/190x140/7761A7/ffffff" alt="...">
                    </div>
                    <div class="fileinput-preview fileinput-exists thumbnail" style="max-width: 200px; max-height: 150px;"></div>
                    <div>
                      <span class="btn btn-primary btn-file"><span class="fileinput-new">选择照片</span><span class="fileinput-exists">更改</span><input type="file" name="..."></span>
                      <a href="#" class="btn btn-danger fileinput-exists" data-dismiss="fileinput">删除</a>
                    </div>
                  </div>
                </div>
              </div>
            </form>
            <button type="button" class="btng btn-success btn-rad">发布</button>
          </div>
        </div>
<!--Footer -->
<div id="footer">
  <div id="footer-inner">
    <div class="client-say">
      <h3>关于“未来旅行家”</h3>
      <img src="images/client.jpg" alt="" class="flleft grayborR" />
      <p>目前旅游业成为一项迅速发展的产业，由此也带来了诸多问题，比如旅游业的一些黑幕和竞争之下带来价格上的比拼和实际质量的缩水。对于景点特色的推荐和黑幕的揭露尤为重要，因此这也是我们网站的特色所在。 </p>
    </div>
    <div class="footer-details">
      <h3>联系我们</h3>
      <div class="address"><img alt="" src="images/address.png"> <strong>地址:</strong> 上海市嘉定区曹安公路4800号同济大学</div>
      <div class="address"><img height="18" width="14" alt="" src="images/phone.png"> <strong>电话:</strong> 18622889061</div>
      <div class="address"><img height="12" width="15" alt="" src="images/mail.png"> <strong>邮箱:</strong> <a href="mailto:23lukia@tongji.edu.cn">23lukia@tongji.edu.cn</a></div>
    </div>
  </div>
  <!--Footer Info-->
</div>
<script src="js/jquery.js"></script>
  <script src="js/jquery.cookie/jquery.cookie.js"></script>
  <script src="js/jquery.pushmenu/js/jPushMenu.js"></script>
  <script type="text/javascript" src="js/jquery.nanoscroller/jquery.nanoscroller.js"></script>
  <script type="text/javascript" src="js/jquery.sparkline/jquery.sparkline.min.js"></script>
  <script type="text/javascript" src="js/jquery.ui/jquery-ui.js" ></script>
  <script type="text/javascript" src="js/jquery.gritter/js/jquery.gritter.js"></script>
  <script type="text/javascript" src="js/behaviour/core.js"></script>

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
  <script src="js/bootstrap/dist/js/bootstrap.min.js"></script>
      <style type="text/css">
    #color-switcher{
      position:fixed;
      background:#272930;
      padding:10px;
      top:50%;
      right:0;
      margin-right:-109px;
    }
    
    #color-switcher .toggle{
      cursor:pointer;
      font-size:15px;
      color: #FFF;
      display:block;
      position:absolute;
      padding:4px 10px;
      background:#272930;
      width:25px;
      height:30px;
      left:-24px;
      top:22px;
    }
    
    #color-switcher p{color: rgba(255, 255, 255, 0.6);font-size:12px;margin-bottom:3px;}
    #color-switcher .palette{padding:1px;}
    #color-switcher .color{width:15px;height:15px;display:inline-block;cursor:pointer;}
    #color-switcher .color.purple{background:#7761A7;}
    #color-switcher .color.green{background:#19B698;}
    #color-switcher .color.red{background:#EA6153;}
    #color-switcher .color.blue{background:#54ADE9;}
    #color-switcher .color.orange{background:#FB7849;}
    #color-switcher .color.prusia{background:#476077;}
    #color-switcher .color.yellow{background:#fec35d;}
    #color-switcher .color.pink{background:#ea6c9c;}
    #color-switcher .color.brown{background:#9d6835;}
    #color-switcher .color.gray{background:#afb5b8;}
 </style>

  <script type="text/javascript">
    var link = $('link[href="css/style.css"]');
    
    if($.cookie("css")) {
      link.attr("href",'css/skin-' + $.cookie("css") + '.css');
    }
    
    $(function(){
      $("#color-switcher .toggle").click(function(){
        var s = $(this).parent();
        if(s.hasClass("open")){
          s.animate({'margin-right':'-109px'},400).toggleClass("open");
        }else{
          s.animate({'margin-right':'0'},400).toggleClass("open");
        }
      });
      
      $("#color-switcher .color").click(function(){
        var color = $(this).data("color");
        $("body").fadeOut(function(){
          //link.attr('href','css/skin-' + color + '.css');
          $.cookie("css", color, {expires: 365, path: '/'});
          window.location.href = "";
          $(this).fadeIn("slow");
        });
      });
    });
  </script>   <script type="text/javascript" src="js/jasny.bootstrap/extend/js/jasny-bootstrap.min.js"></script>
<script type="text/javascript" src="js/bootstrap.daterangepicker/moment.min.js"></script>
<script type="text/javascript" src="js/bootstrap.daterangepicker/daterangepicker.js"></script>
<script type="text/javascript" src="js/bootstrap.touchspin/bootstrap-touchspin/bootstrap.touchspin.js"></script>
<script type="text/javascript" src="js/bootstrap-colorpicker/dist/js/bootstrap-colorpicker.js"></script>
<script type="text/javascript" src="js/bootstrap.switch/bootstrap-switch.js"></script>
<script type="text/javascript" src="js/bootstrap.datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="js/jquery.select2/select2.min.js" ></script>
<script type="text/javascript" src="js/bootstrap.slider/js/bootstrap-slider.js" ></script>
<script type="text/javascript" src="js/jquery.icheck/icheck.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
      /*Date Range Picker*/
      $('#reservation').daterangepicker();
      $('#reservationtime').daterangepicker({
        timePicker: true,
        timePickerIncrement: 30,
        format: 'MM/DD/YYYY h:mm A'
      });
      var cb = function(start, end) {
        $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
        alert("Callback has fired: [" + start.format('MMMM D, YYYY') + " to " + end.format('MMMM D, YYYY') + "]");
      }

      var optionSet1 = {
        startDate: moment().subtract('days', 29),
        endDate: moment(),
        minDate: '01/01/2012',
        maxDate: '12/31/2014',
        dateLimit: { days: 60 },
        showDropdowns: true,
        showWeekNumbers: true,
        timePicker: false,
        timePickerIncrement: 1,
        timePicker12Hour: true,
        ranges: {
           'Today': [moment(), moment()],
           'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
           'Last 7 Days': [moment().subtract('days', 6), moment()],
           'Last 30 Days': [moment().subtract('days', 29), moment()],
           'This Month': [moment().startOf('month'), moment().endOf('month')],
           'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
        },
        opens: 'left',
        buttonClasses: ['btn btn-default'],
        applyClass: 'btn-small btn-primary',
        cancelClass: 'btn-small',
        format: 'MM/DD/YYYY',
        separator: ' to ',
        locale: {
            applyLabel: 'Submit',
            cancelLabel: 'Clear',
            fromLabel: 'From',
            toLabel: 'To',
            customRangeLabel: 'Custom',
            daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr','Sa'],
            monthNames: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
            firstDay: 1
        }
      };

      var optionSet2 = {
        startDate: moment().subtract('days', 7),
        endDate: moment(),
        opens: 'left',
        ranges: {
           'Today': [moment(), moment()],
           'Yesterday': [moment().subtract('days', 1), moment().subtract('days', 1)],
           'Last 7 Days': [moment().subtract('days', 6), moment()],
           'Last 30 Days': [moment().subtract('days', 29), moment()],
           'This Month': [moment().startOf('month'), moment().endOf('month')],
           'Last Month': [moment().subtract('month', 1).startOf('month'), moment().subtract('month', 1).endOf('month')]
        }
      };

      $('#reportrange span').html(moment().subtract('days', 29).format('MMMM D, YYYY') + ' - ' + moment().format('MMMM D, YYYY'));

      $('#reportrange').daterangepicker(optionSet1, cb);

      $('#reportrange').on('show', function() { console.log("show event fired"); });
      $('#reportrange').on('hide', function() { console.log("hide event fired"); });
      $('#reportrange').on('apply', function(ev, picker) {
        alert("mama mia");
        console.log("apply event fired, start/end dates are " 
          + picker.startDate.format('MMMM D, YYYY') 
          + " to " 
          + picker.endDate.format('MMMM D, YYYY')
        ); 
      });
      $('#reportrange').on('cancel', function(ev, picker) { console.log("cancel event fired"); });
      /*Switch*/
      $('.switch').bootstrapSwitch();      
      /*DateTime Picker*/
        $(".datetime").datetimepicker({format: 'yyyy-mm-dd hh:ii'});
        $("#datetime1").datetimepicker({format: 'yyyy-mm-dd'});
      
      /*Select2*/
        $(".select2").select2({
          width: '100%'
        });
      
       /*Tags*/
        $(".tags").select2({tags: 0,width: '100%'});
      
       /*Slider*/
        $('.bslider').slider();     
      
      /*Input & Radio Buttons*/
        $('.icheck').iCheck({
          checkboxClass: 'icheckbox_flat-green',
          radioClass: 'iradio_flat-green'
        });
      /*spinners*/
        $("input[name='cleaninit']").TouchSpin();
        $("input[name='demo1']").TouchSpin({
          min: 0,
          max: 100,
          step: 0.1,
          decimals: 2,
          boostat: 5,
          maxboostedstep: 10,
          postfix: '%'
        });
        $("input[name='demo2']").TouchSpin({
          min: -1000000000,
          max: 1000000000,
          stepinterval: 50,
          maxboostedstep: 10000000,
          prefix: '$'
        });
        $("input[name='demo4']").TouchSpin({
          postfix: "a button",
          postfix_extraclass: "btn btn-default"
        });
      /*End of spinners*/
      /*Color Picker*/
        $('.demo1').colorpicker({
          format: 'hex', // force this format
        });
        $('.demo2').colorpicker({
          format: 'hex', // force this format
        });
        $('.demo-auto').colorpicker();
        // Disabled / enabled triggers
        $(".disable-button").click(function(e) {
            e.preventDefault();
            $("#demo_endis").colorpicker('disable');
        });

        $(".enable-button").click(function(e) {
            e.preventDefault();
            $("#demo_endis").colorpicker('enable');
        });

        
      /*End of Color Picker*/
    });
</script>
  
  
<script type="text/javascript" src="js/jquery.flot/jquery.flot.js"></script>
<script type="text/javascript" src="js/jquery.flot/jquery.flot.pie.js"></script>
<script type="text/javascript" src="js/jquery.flot/jquery.flot.resize.js"></script>
<script type="text/javascript" src="js/jquery.flot/jquery.flot.labels.js"></script>
</body>
</html>
